<template>
    <div class="attr-list">
      <CommonForm :onChange="handleChange" :formData="pageSetting.globalTitleStyle" :formJson="formJson" />
    </div>
</template>

<script >
import { mapState } from 'vuex'
import getStyleFormJson from "./setting"

import CommonForm from "../../../../common/CommonForm/index2.jsx"
import { addSnapshot } from "../../../lib/utils"

export default {
  data() {
    return {
      
    }
  },
  computed: {
    ...mapState("lowCode", {
      pageSetting: state => state.pageSetting
    }),
    formJson(){
      return getStyleFormJson()
    }
  },
  components: {
    CommonForm,
  },
  methods: {
    handleChange(fieldName, value){
      console.log(fieldName, value)
      this.pageSetting.globalTitleStyle[fieldName] = value
      this.$store.commit("lowCode/setPageSetting", this.pageSetting)
      addSnapshot('page', {
        pageSetting: this.pageSetting
      })
    },
    
  }
}
</script>

<style lang="less" scoped>
  @import url("./index.less");
</style>
